<template>
  <div class="withdraw">
      <!-- 提示信息 -->
      <van-notice-bar
        :text="tip"
        left-icon="../static/voice.png"
        />
      <!-- 提现详细 -->
      <div class="">
          <van-cell-group class="withdraw-form">
            <van-field class="withdraw-field"
                v-model="amt_remain"
                label="账户余额:"
                left-icon="exchange"
                disabled
            />
            <van-field class="withdraw-field"
                v-model="withdraw_amt"
                label="提现金额:"
                placeholder="请输入金额"
                required
                left-icon="exchange"
            >
            元
            </van-field>
            </van-cell-group>
      </div>
      <!-- 提现 -->
      <div class="withdraw-pay">
        <van-submit-bar
            :loading="loading"
            :price="withdraw_amt*100"
            button-text="提现"
            @submit="withdraw"
        />
      </div>
      <back :scroll="false"></back>
  </div>
</template>

<script>
import back from '../../components/base/back.vue'

export default {
  name: 'withdraw',
  comments: 'withdraw',
  components: {
    back
  },
  data () {
    return {
      tip: '提现需要后台审核，请耐心等待提现结果...',
      course: {},
      time: '',
      loading: false,
      person_num: 1,
      amt_remain: '200',
      withdraw_amt: ''
    }
  },
  created () {
    if (localStorage.pay === 'done') {
      document.title = '提现'
      // this.getAccount()
      localStorage.pay = ''
    } else {
      localStorage.pay = 'done'
      window.location.reload()
    }
  },
  methods: {
    getAccount () {
      var that = this
      this.$axios.get('/account/' + this.$router.history.current.query.course_id).then(response => {
        that.course = response.data
        that.time = that.$date(response.data.start_time, 'YYYY-mm-DD') + '到' + that.$date(response.data.end_time, 'YYYY-mm-DD')
      })
    },
    // 微信支付
    paySubmit: function (info) {
      function onBridgeReady () {
        WeixinJSBridge.invoke(
          'getBrandWCPayRequest', info,
          function (res) {
            if (res.err_msg === 'get_brand_wcpay_request:ok') {

            }
          }
        )
      }
      if (typeof WeixinJSBridge === 'undefined') {
        if (document.addEventListener) {
          document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
        } else if (document.attachEvent) {
          document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
          document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
        }
      } else {
        onBridgeReady()
      }
    },
    // 提现确认
    withdraw: function (e) {
      var that = this
      this.$axios.post('/users/' + JSON.parse(localStorage.user).id + '/orders', {
        amount: that.course.origin_price,
        real_amount: that.course.origin_price,
        type: 'course',
        course_id: that.course.id
      }).then(response => {
        that.$toast.success('支付成功！')
        that.paySubmit(response.data)
      }).catch(error => {
        that.$toast.fail('支付失败！')
        console.log(error)
      })
    }
  }
}
</script>
<style lang="postcss" scoped>
.withdraw{
    width: 100%;
    height: 100%;
    margin-bottom: 50px;
}
.withdraw-form{
    margin: 10px;
}
.withdraw-field{
    background-color: #eee;
    color: #eb83ec;
    border-bottom: 1px solid #fff;
    text-align: left;
}
.withdraw-field:last-child{
    border-bottom: none;
}
.withdraw-discount{
    margin-top: 10px;
}
.discount-list{
    height: 80%;
}
.withdraw-pay{
    position: fixed;
    bottom: 0px;
    width: 100%;
    z-index: 999;
}
</style>
